<!-- D:/project/app/ydz-app-uniapp/static/images/mine -->
<template>
	<view class="pagebody">
		<view class="topbox">
			<view class=" align-center justify-between">
				<view class=" flex-row align-center">
					<image @click="backpage" src="@/static/images/login/leftjt.png" alt=""
						style="width: 48rpx;height: 48rpx;"></image>
				</view>
				<view class="color303b39 fz40 fwbold">
					添加用药提醒
				</view>
				<view class="">
				</view>
			</view>
		</view>
		<view class="" style="padding: 24rpx;">
			<view class="inputbox align-center" style="">
				<uni-easyinput v-model="usedrugform.remindTitle" :placeholderStyle="placeholderStyle"
					placeholder="请输入提醒标题"></uni-easyinput>
			</view>
			<view class="inputbox align-center" style="margin-bottom: 16rpx;">
				<view class="example-body" style="width: 100%;">
					<uni-datetime-picker :border="false" type="datetime" v-model="usedrugform.remindTime"
						@change="changeLog" />
				</view>
			</view>

			<textarea v-model="usedrugform.remindContent" :placeholderStyle="placeholderStyle"
				style="padding-left: 20rpx;width: -webkit-fill-available;line-height: 64rpx;" maxlength="1000"
				placeholder="请输入提醒内容(建议1-200字)" name="" id="" cols="30" rows="10"></textarea>



			<view class="fwbold addcase align-center justify-center" @click="toadd">
				保存
			</view>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import AdvCom from '../../layouts/advcome.vue';
	import {
		addreminder,
		getreminder,
		editreminder
	} from '@/api/api.js'
	export default {
		components: {

		},
		onLoad(options) {
			if(options.id){
				this.editid = Number(options.id)
				this.getreminderbyid(this.editid)
			}

		},


		data() {
			return {
				placeholderStyle: "color:#7E8987;font-size:32rpx",
				editid:null,
				usedrugform: {
					remindTime: '',
					remindTitle: '',
					remindContent: '',
				},


			}
		},
		watch: {},
		created() {},
		methods: {
			getreminderbyid(id){
				getreminder(id).then(res=>{
					this.usedrugform = res.data
					// this.usedrugform.remindTime = res.data.remindTime
					// this.usedrugform.remindTitle = res.data.remindTitle
					// this.usedrugform.remindContent = res.data.remindContent
				})
			},
			toadd(){
				if(this.usedrugform.remindTitle==''){
					this.$refs.uToast.show({
						title: '请填写提醒标题',
					})
					return
				}else if(this.usedrugform.remindTime==''){
					this.$refs.uToast.show({
						title: '请选择日期时间',
					})
					return
				}else if(this.usedrugform.remindContent==''){
					this.$refs.uToast.show({
						title: '请填写提醒内容',
					})
					return
				}else{
					if(this.editid){
						this.usedrugform.id = Number(this.editid)
						editreminder(this.usedrugform).then(res=>{
							this.$refs.uToast.show({
								title: '修改提醒成功！',
								type: 'success',
							})
							setTimeout(() => {
								uni.navigateBack({
									delta: 1
								});
							}, 1000)
						})
					}else{
						addreminder(this.usedrugform).then(res=>{
							this.$refs.uToast.show({
								title: '添加提醒成功！',
								type: 'success',
							})
							setTimeout(() => {
								uni.navigateBack({
									delta: 1
								});
							}, 1000)
						})
					}

				}
			},
			changeLog(e) {
				console.log(e)
				this.usedrugform.remindTime = e
			},
			backpage() {
				uni.navigateBack({
					delta: 1,
				});
			},
		},
	}
</script>

<style lang="scss" scoped>
	::v-deep .is-input-border {
		border: none;
	}

	::v-deep .uni-easyinput__content {
		background: transparent !important;
	}

	::v-deep .uni-input-input {
		font-size: 32rpx;
	}

	::v-deep .uni-icons {
		display: none !important;
	}

	::v-deep .uni-date__x-input {
		padding-left: 18rpx;
		color: #7E8987;
		font-size: 32rpx
	}

	.pagebody {
		padding-bottom: 136rpx;
		background: #FFF;

		.topbox {
			height: 128rpx;
			background: linear-gradient(180deg, rgba(0, 217, 178, 0.2) 0%, rgba(0, 217, 178, 0) 100%);
			padding: 20rpx 24rpx;
		}

		.inputbox {
			height: 96rpx;
			border-bottom: 1px solid #D7DDDC;
		}

		.istype {
			background: #E5FBF7 !important;
			color: #00977C;
			font-weight: bold;
		}

		.addcase {

			margin-top: 179rpx;
			height: 98rpx;
			background: #00D9B2;
			border-radius: 98rpx;
			color: #FFFFFF;
			font-size: 36rpx;
		}


	}
</style>